<template>
    <a-card :bordered="false" style="background-color: rgba(239, 250, 251, 1);" :style="{minHeight: cardHeight + 'px'}" size="small">
        <template v-if="showFirst">
            <div class="searchIpt" >
                <a-row>
                    <a-col span="24">
                        <div class="sit">外部专家检索</div>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col span="24">
                      <a-input-search placeholder=""
                                      size="large"
                                      @search="search">
                      </a-input-search>
<!--                        <a-input-search placeholder="" @search="search">-->
<!--                            <a-select slot="addonBefore" default-value="0" style="width: 120px; font-size: 18px; border-radius: 0 0 50px 50px; padding-left: 5px;" @change="handleChange">-->
<!--                                <a-select-option value="0">-->
<!--                                    综合检索-->
<!--                                </a-select-option>-->
<!--                                <a-select-option value="1">-->
<!--                                    主题-->
<!--                                </a-select-option>-->
<!--                                <a-select-option value="2">-->
<!--                                    作者-->
<!--                                </a-select-option>-->
<!--                                &lt;!&ndash;                <a-select-option value="3">&ndash;&gt;-->
<!--                                &lt;!&ndash;                  领域&ndash;&gt;-->
<!--                                &lt;!&ndash;                </a-select-option>&ndash;&gt;-->
<!--                            </a-select>-->
<!--                        </a-input-search>-->
                    </a-col>
                </a-row>
            </div>
            <!--      <a-button type="primary" @click="dealTag">-->
            <!--        过滤-->
            <!--      </a-button>-->
            <div style="width: 80%; margin: 20px auto; text-align: center">
                <a-row>
                    <a-col span="24">
                        <template v-for="item in randomTags">
                            <a-tag color="#79abb1" style="font-size: 18px;line-height: 25px; cursor: pointer" @click="search(item.name)">
                                {{item.name}}
                            </a-tag>
                        </template>
                    </a-col>
                </a-row>
            </div>
            <div style="width: 80%; margin: 20px auto; text-align: right;">
                <a-button style="background-color: #038181; color: #fff;" @click="toShowTop()">
                    <a-icon type="eye" theme="filled" />{{showTop ? '查看推荐' : '合作排行榜'}}
                </a-button>
            </div>
            <div style="width: 80%; margin: 20px auto;" v-if="!showTop">
                <a-row :gutter="24">
                    <a-col span="12">
                        <a-card class="cardcommon first" size="small">
                            <a-row>
                                <a-col span="2" class="dott_f" style="color: rgba(0, 128, 128, 1);">•</a-col>
                                <a-col span="18" class="centt">
                                    <span class="leftTit" style="color: rgba(0, 128, 128, 1);">综合热点成果 </span>
                                    <span class="centerTit">当前的热点成果</span>
                                </a-col>
<!--                                <a-col span="4" class="rightTit" @click="randomFruit(1)"><a-icon type="sync" style="color: #008080"/></a-col>-->
                            </a-row>
                            <a-spin tip="数据加载中..." v-if="!isHaveFirstData">
                                <div class="spin-content_fir">
                                </div>
                            </a-spin>
                            <template v-if="isHaveFirstData">
                                <div v-for="item in hotResultData">
                                    <!--                                <a-row >-->
                                    <!--                                    <a-col span="2" class="dottc" style="color: rgba(0, 128, 128, 1);">•</a-col>-->
                                    <!--                                    <a-col span="22" class="centt">-->
                                    <!--                                        <span class="autn" style="color: rgba(0, 128, 128, 1);">{{item.authorName}} </span>-->
                                    <!--                                    </a-col>-->
                                    <!--                                </a-row>-->
                                    <!--                                <template v-for="itemContent in item.resultModelList">-->
                                    <!--                                    <div class="contc_firt cont_comm" >-->
                                    <!--                                        <div style="font-size: 15px; text-align: left; line-height: 30px; padding: 5px 20px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" @click="showFruitInfo(itemContent)">-->
                                    <!--                                            {{itemContent.fruitName}}-->
                                    <!--                                        </div>-->
                                    <!--                                    </div>-->
                                    <!--                                </template>-->
                                    <div class="contc_firt cont_comm" >
                                        <a-row>
                                            <a-col span="18" class="dottc" style="font-size: 15px; text-align: left; line-height: 30px; padding: 5px 20px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" @click="showFruitInfo(item)">
                                                {{item.fruitName}}
                                            </a-col>
                                            <a-col span="6" class="centt">
                                                <span class="autn" style="color: rgba(0, 128, 128, 1);">{{item.pubTime.substring(0,10)}} </span>
                                            </a-col>
                                        </a-row>
                                    </div>
                                </div>
                            </template>
                        </a-card>
                    </a-col>
                    <a-col span="12">
                        <a-card class="cardcommon two" size="small">
                            <a-row>
                                <a-col span="2" class="dott_s">•</a-col>
                                <a-col span="18" class="centt">
                                    <span class="leftTit">领域成果推荐 </span>
                                    <span class="centerTit">当前研究领域关联的成果</span>
                                </a-col>
<!--                                <a-col span="4" class="rightTit" @click="randomFruit(2)"><a-icon type="sync"  /></a-col>-->
                            </a-row>
                            <a-spin tip="数据加载中..." v-if="!isHaveTwoData">
                                <div class="spin-content_sec">
                                </div>
                            </a-spin>
                            <template v-if="isHaveTwoData">
                                <div v-for="item in hyResultData">
                                    <!--                                <a-row >-->
                                    <!--                                    <a-col span="2" class="dottc">•</a-col>-->
                                    <!--                                    <a-col span="22" class="centt">-->
                                    <!--                                        <span class="autn">{{item.authorName}}  </span>-->
                                    <!--                                    </a-col>-->
                                    <!--                                </a-row>-->
                                    <!--                                <template v-for="itemContent in item.resultModelList">-->
                                    <!--                                    <div class="contc_sec cont_comm">-->
                                    <!--                                        <div style="font-size: 15px; text-align: left; line-height: 30px; padding: 5px 20px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" @click="showFruitInfo(itemContent)">-->
                                    <!--                                            {{itemContent.fruitName}}-->
                                    <!--                                        </div>-->
                                    <!--                                    </div>-->
                                    <!--                                </template>-->
                                    <div class="contc_sec cont_comm" >
                                        <a-row>
                                            <a-col span="18" class="dottc" style="font-size: 15px; text-align: left; line-height: 30px; padding: 5px 20px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" @click="showFruitInfo(item)">
                                                {{item.fruitName}}
                                            </a-col>
                                            <a-col span="6" class="centt">
                                                <span class="autn" style="color: rgba(251, 127, 93, 1);">{{item.pubTime.substring(0,10)}} </span>
                                            </a-col>
                                        </a-row>
                                    </div>
                                </div>
                            </template>
                        </a-card>
                    </a-col>
                </a-row>
            </div>
            <div style="width: 80%; margin: 20px auto;" v-if="showTop">
                <a-row :gutter="24">
                    <a-col span="12">
                        <a-card class="cardcommon first" size="small">
                            <a-row>
                                <a-col span="2" class="dott_f" style="color: rgba(0, 128, 128, 1);">•</a-col>
                                <a-col span="18" class="centt">
                                    <span class="leftTit" style="color: rgba(0, 128, 128, 1);">合作次数 </span>
                                </a-col>
                            </a-row>
                            <a-row style="margin: 10px;">
                                <a-col span="18" class="leftTit" style="color: rgba(0, 128, 128, 1);">
                                    <a-radio-group name="radioGroup" v-model="firRadioValue" @change="onFirChange">
                                        <a-radio :value="1">
                                            论文
                                        </a-radio>
                                        <a-radio :value="2">
                                            专利
                                        </a-radio>
                                        <a-radio :value="3">
                                            领域
                                        </a-radio>
                                    </a-radio-group>
                                    <a-select style="width: 200px" @change="changeCooNumFiled" v-if="firRadioValue == 3">
                                        <a-select-option v-for="item in fieldsArr" :value="item.name">
                                            {{item.name}}
                                        </a-select-option>
                                    </a-select>
                                </a-col>
                                <a-col span="6" class="leftTit" style="color: rgba(0, 128, 128, 1);">
                                    top:
                                    <a-select default-value="20" @change="changeFirPageSize" style="width: 60px;">
                                        <a-select-option value="20">
                                            20
                                        </a-select-option>
                                        <a-select-option value="50">
                                            50
                                        </a-select-option>
                                    </a-select>
                                </a-col>
                            </a-row>
                            <a-spin tip="数据加载中..." v-if="!showTopFirstLoading">
                                <div class="spin-content_fir">
                                </div>
                            </a-spin>
                            <template v-if="showTopFirstLoading">
                                <a-row class="colHead">
                                    <a-col span="4">
                                        序号
                                    </a-col>
                                    <a-col span="16">
                                        作者姓名
                                    </a-col>
                                    <a-col span="4">
                                        合作次数
                                    </a-col>
                                </a-row>
                                <div style="height: 520px; overflow: auto;">
                                    <a-row v-for="(item, index) in topFirData" :key="index" class="colCont">
                                        <a-col span="4">
                                            <div>{{index+1}}</div>
                                        </a-col>
                                        <a-col span="16">
                                            {{item.authorName}}
                                        </a-col>
                                        <a-col span="4">
                                            {{item.cooperationNum}}
                                        </a-col>
                                    </a-row>
                                </div>
                            </template>
                        </a-card>
                    </a-col>
                    <a-col span="12">
                        <a-card class="cardcommon first" size="small">
                            <a-row>
                                <a-col span="2" class="dott_f">•</a-col>
                                <a-col span="18" class="centt">
                                    <span class="leftTit" style="color: rgba(0, 128, 128, 1);">成果数量 </span>
                                </a-col>
                            </a-row>
                            <a-row style="margin: 10px;">
                                <a-col span="18" class="leftTit" style="color: rgba(0, 128, 128, 1);">
                                    <a-radio-group name="radioGroup" v-model="secRadioValue" @change="onSecChange">
                                        <a-radio :value="1">
                                            论文
                                        </a-radio>
                                        <a-radio :value="2">
                                            专利
                                        </a-radio>
                                        <a-radio :value="3">
                                            领域
                                        </a-radio>
                                    </a-radio-group>
                                    <a-select style="width: 200px" @change="changFruitNumFiled" v-if="secRadioValue == 3">
                                        <a-select-option v-for="item in fieldsArr" :value="item.name" allowClear>
                                            {{item.name}}
                                        </a-select-option>
                                    </a-select>
                                </a-col>
                                <a-col span="6" class="leftTit" style="color: rgba(0, 128, 128, 1);">
                                    top:
                                    <a-select default-value="20" @change="changeSecPageSize" style="width: 60px;">
                                        <a-select-option value="20">
                                            20
                                        </a-select-option>
                                        <a-select-option value="50">
                                            50
                                        </a-select-option>
                                    </a-select>
                                </a-col>
                            </a-row>
                            <a-spin tip="数据加载中..." v-if="!showTopTwoLoading">
                                <div class="spin-content_fir">
                                </div>
                            </a-spin>
                            <template v-if="showTopTwoLoading">
                                <a-row class="colHead">
                                    <a-col span="4">
                                        序号
                                    </a-col>
                                    <a-col span="16">
                                        作者姓名
                                    </a-col>
                                    <a-col span="4">
                                        成果数量
                                    </a-col>
                                </a-row>
                                <div style="height: 520px; overflow: auto;">
                                    <a-row v-for="(item, index) in topSecData" :key="index" class="colCont">
                                        <a-col span="4">
                                            <div>{{index+1}}</div>
                                        </a-col>
                                        <a-col span="16">
                                            {{item.authorName}}
                                        </a-col>
                                        <a-col span="4">
                                            {{item.num}}
                                        </a-col>
                                    </a-row>
                                </div>
                            </template>
                        </a-card>
                    </a-col>
                </a-row>
            </div>
        </template>
        <template v-if="showTwo">
            <talent-fruit :key="new Date().getTime()"  ref="childTalentFruit" @changeShow="showDiv" @changeObj="changeObj"></talent-fruit>
        </template>
        <fruit-info ref="fruitInfo"></fruit-info>
    </a-card>
</template>

<script>

import talentFruit from './TalentFruit.vue'
import fruitInfo from './FruitInfo.vue'
import { postAction, getAction } from '../../api/manage'

function getRandomArrayElements(arr, count) {
    let shuffled = arr.slice(0), i = arr.length, min = i - count, temp, index;
    while (i-- > min) {
        index = Math.floor((i + 1) * Math.random());
        temp = shuffled[index];
        shuffled[index] = shuffled[i];
        shuffled[i] = temp;
    }
    return shuffled.slice(min);
}

export default {
    name: 'TalentMain',
    components: {
        talentFruit,
        fruitInfo
    },
    data() {
        return {
            cardHeight: 0,
            mainTags: ['中心环节','开路故障','接地电极','通电转动','实时显示','钢材用量','稳态仿真','短路负荷','控制指标','节点相关性','生长速度','错误高估','试验室','对策建议','建设阶段','机械拉伸','全前馈','联合系统效益','优化体系','参考电流','临界承载力','东北部','迭代求解法','计划经济','运行状况','气动性能','高铁网络','黄菖蒲','传统分区规划','高素质','高校大学生','数字仿真装置','服务器','几何布局','湖北省','电流环','脆弱性','绝缘丝绳','精确预测','主观性较强','选择方法','油色谱','DEA模型','固有频率','资源节约型','贡献百分比','迁移机理','直流电缆','天然酯绝缘油','运行费用','典型日','开启时长','扩张状态','融合应用','非晶合金','颜色标注','系统误差','输入功率','碳约束','溪洛渡','阳离子膜','综合收益','安培力','传递函数','特高压GIL','技术成熟','交流断路器','接枝产物','配电网运行','课堂教学','系统失稳','区域分解','核磁共振','起降控制器','历史运行数据','特殊问题','蜂巢状配电网','硬件电路','排放特性','散热器','用户侧准入','具体评估模型','厂商市场力','冗余方案','电压源','分束器','常规治疗','额定风速','故障管','网络负载均衡','无线通信','适用于','河南电网','第二引射器','电压谐波','充电完成','远方监控中心','工频磁场','电力业务','输入端','会计稳健性','高度调节','中国传媒大学','介质损耗因数','全球能源体系','负荷需求响应','运行曲线','分析仪','复合控制系统','中压配网','多径现象','科研管理型','热电池组','电气参量','应对策略','成熟商业软件','实验经济学','产权制度改革','深度网络','支撑系统','价值平台','不均匀采购','螺杆伸缩','内短路程度','研究机构','能量管理','沿面绝缘性能','周向泄漏','功率削减量','功率均分','监管缺位','管道流量','放线滑车','风险投资','单断口','用户需求','功率放大器','负荷点','炉膛后墙','数据要素','组织结构','定价策略','产业发展','北京某公园','碎石层','进风口','业财融合模式','复杂系统','牛顿法','交易信息','产生的原因','恶意主体','公有制','节能效果','带电作业工具','Hopf分岔','固定工作头','俄罗斯','电源参数','检修和维护','最优化技术','标准曲线','水力发电','适用性广','功能测试命令','局部放电','工程量清单','紧急状态','故障线路','评价矩阵','相间短路保护','划时代','能效电厂','清灰钢刷','分配方法','光伏发电出力','单相接地','接线方法','高压输电线','集群终端','天气依赖','综合诊断','风险库','最优工况','复杂微电网','反应床','无功控制','及时有效','随机发电','攀爬机器人','市场力水平','知识分权','过负荷判据','分布特征','整体形状','重点任务','学科基础','文献计量','组合权重','取材方便','两权分离','发展趋势','架设避雷线','预设目标函数','每相4分支','低温省煤器','配套政策','供电端口','售电均价','推广使用','自我存在','小波包','多次故障','风电功率预测','电力需求响应','分区电网','分裂导线','基波无功','CC&G算法','无量纲分析','银行信贷','线性组合','质量浓度','远近结合','现有机组','振荡事件','换热器模型','本体结构','减压阀','运行机理','惯性支撑','出力预测方法','稳定性问题','更全面','电力系统工程','中国经济发展','运行特性','故障回路','脚手架','冷底板','模块化多电平','分离室','潜在风险','稳定态','变化数据流','衰减速度','解决方法','时间分辨率','中性线支柱','特征分析','运行问题','典型缺陷','项目群评价','配套措施','误差梯度','将军帽','中央事权','京津冀北','跟踪误差','电网信号','检测盲区','工程调试','交通运输业','柔直系统','市场化','独联体','最优容量配置','启动电路','电树枝','多飞行器','高新技术企业','自然冷却','保护距离','检测周期短','二极管桥臂','多种机制','两阶段','电力用户','存量资产','参数不确定性','发展方式','电容电压','政策样本','系统停运','超声波传播','特征频谱','自主确定','柔性互动装置','中长期市场','载波通信','仿真研究','工程量','固定直流电压','压缩空气系统','同类系统','用户行为','稳定联盟','；第三','快速安装','新能源发电','出力波动','国家电网','增量因素','电缆中间接头','维护优势','装置设计','国际合作','接线型式','显微镜','典型模型','电筒灯罩','阻尼控制','海外业务','机组组合方法','连接孔','蒸汽添加量','圆筒电极内径','诱骗态协议','安装端板','振动解耦','双阀组','校核原则','数字化变电站','商誉相关问题','电池储能站','边缘计算','存储模块','年净收益','用户拓扑关系','内料位','极限诱导分岔','红外光谱分析','高风速','组文化趋势','控制双回线路','初始阶段','大面积停电','水热反应','模型求解','腐蚀性','无功源','优化调度模型','可靠度水平','用户节能','抽气泵','离子迁移管','配置储热','浇水通管','讨论会','网络约束条件','模块化','业务数据','同时率','三站六线模式','扩展性强','仿真平台','电压跌落','风电产业','权重目标值','集成电路','透明罩板','绿电溯源','可再生能源','电流回路','输电铁塔','区域信息','时空特性','旅游目的地','灵活性','蓄电池模型','表现较差','资源分类','不可转移效用','消纳率','实际工作','混沌搜索','定量化','文本数据','物理意义','环氧树脂','教职工','企业绩效','高效利用','发展水平','合理建设','火打捆','最优容量','复杂网络','电力系','传动滚筒','电流信号','正确率','快速控制','集成技术','位置空间','转动机构','积极性','信号采样理论','环境压力','触发条件','语义分析','的合理性','建模计量法','显示模块','雷诺数','夹持底座','快速评估模型','持续性','集控装置','总成本','物理机制','固态硬盘','多项式系数','投切方案','电网特性','实际生产','设备和介质','电化学','无线通讯模块','最大负荷','审慎监管','高速铁路','柴油发电机','快速配置','发展愿景','电压特性','模糊层次分析','新能源汇集区','余补累积概率','废物利用','迭代次数多','典型案例','电网调度操作','联合运营','不亚于','零售商库存','地铁牵引供电','基础研究','防渗性能','铷铯掺杂','支撑机构','国内首座','海上风资源','园区线变','占地面积','电寿命','直流电阻率','重要方面','普惠金融','组合规则','频率特性','平均水平位移','三相变流器','最优解求解','保护体系','权重提取','绝缘材料','脱硫塔','性能影响','多风电场','中央处理器','振动数据','关键线路','性能优劣','最大振动点','剩余能量','运筹学','直流变换器','实现方案','安全风险','铝合金芯电缆','基础图','设备控制','采集单元','信息数据','生物进化论','交易完成','智慧电厂','有关分析','多控制区','圆周角度','通信正常','目标月','评级指标体系','绝缘杆','控制参数','人工智能技术','优化结果','电子实验','防尘效果好','混合策略','最优安装位置','大用户','电导增量','VC++','产业现状','交流输电','电动卷扬机','限速模块','单项目评价','电池模块组','张紧轮','有效识别','光线传感器','转接器','超声波传感器','可信度','台区拓扑结构','快速充电站','电网项目','整流器','新能源装','产气规律','科学化','节约能源','可中断电价','封装光纤光栅','传统电网','能源效率管理','弹性模量成型','运行时间','有效途径','主蒸汽压力','预警等级','交联度','高压电源','智能端子','大范围停电','广域源-荷','制高点技术','粉尘过滤罩','汽轮发电机','模拟试验','线性松弛','实体属性关系','工业机器人','掺配均匀性','电力电子化','电子流量计','区域产业集聚','发电机层','优化特征子集','多场景应用','最优政策工具','逆变器','实验值','保护控制方法','突发灾害','系统状态','实验室','时间抽样','电力线','逆功率','交直流系统','厂用电率','多能流','快速交换','信息运维部门','外交空间','聚合模型','脱除效果','交流耗能装置','边界型治理','干扰电压','经验公式','开断性能','蒸汽喷嘴','一次网','接地线装置','外观大小','Q学习算法','热工优化','搅拌机','汽机余热','实效性','国际市场','放电模型','协同规划','运行决策','临界直径','小黄车','设计方案','运行安全性','体制因素淡化','技术难题','单一类型','石灰石','控制目标值','激励线圈','有效举措','风电光伏','最小偏差','三工位','使用需求','分时充电价格','新时代','抢修资源','时间确定','接地线','电储能','量化方法','输出端','时间维度','源数据','换位段数','节能调度效益','表面放电','灵敏性','支撑平台','憎水性表面','劳动生产率','敏感负荷','单元响应','标准体系','输配电','智能调整','高灵敏度','负荷日数据','成矿条件','理论探索','交流通道','电流数据','近端型','多叉树','平面度','车载雷达','现有理论','资产价格','凸台后','恢复计划','电源规划','电解槽','稳态性','直流落点','科技手段','发电机出力','试运行','灵活运用','电力公司','油浴设备','无人机','前期规划','专业分析管控','回收价格','工业以太网','预防控制','柔性负荷','成本差异','高效计算','网络营销','基础处理','精英策略','博弈论方法','清洁能源消纳','节点系统','资源优化配置','异常检测','清洗消毒键','实测轨迹','氟硅橡胶','边境合作','光伏功率预测','容量衰减','电网可靠运行','设计参数','应用方案','共渗剂','经济活力','区域发展政策','区间数','自动化控制','贝杰龙模型','CIM标准','平衡鼓间隙','桥接型系统','高频切机措施','接触失效机理','智能方法','适宜采暖技术','用户连接','复合绝缘子','决策依据','不一致性','短路电流','子系统','负荷预测结果','高比例','电缆导体','场景要求','运行安全','经济优化模型','耦合误差','人工染污','风险偏好','坏数据分类','机器视觉','杀菌消毒','设备运行','温湿度','防盗性能','核验方法','大型事故','高分子主链','数据通信','第一限位板','超声传感器','增量配电改革','累计概率曲线','行业生态构建','晶闸管阀串','优化调度','机制设计','动态更新','特高频','真空干燥','测距滑轮','平衡机越限','元件故障','影响机制','运行风险评估','介电性能','评价指标体系','功率配比','恋爱观','避雷器','负荷侧电压','电力负荷','直流电','纳米多孔金属','珠海横琴岛','能源调度','区域代理','实验方法','电接点式','储能资源分配','适应度函数','协同控制策略','风电场建设','时间断面','高龄者','不确定信息','心理学','覆冰绝缘子','系统运行','建设方案','替代作用','随机激励','走廊规划','甘肃省','流量处理中心','温度场分布','梯次利用','电压支撑','出气口','分布情况','战略决策','空间电场','红外官能团','交流电源','伪序列','鄂西北','财务管理模式','中新世侵入岩','主网无功规划','负荷调控','可研深度','等可靠性原则','量化研究','差动保护','变压器','动态调整','闭环控制','智能化发展','OPF算法','可控间隙','干扰信号','电能供给','可再生资源','换相失败检测','间冷器','概念模型','充电器','仿真实验','安全使用','预应力结构','可靠性成本','京津唐电网','需求响应潜力','蓄热控制过程','应用模式','干扰原因','KH优化算法','系统平台','可更换为','变化规律','培育网络公民','负序分量','科研环境','传统管理方式','充电站','研究难点','自适应技术','面向服务','功率波动','功率计划','锅炉蓄热','故障情况','债务结构','需求侧响应','轴向励磁线圈','合并监管','直流控制系统','过速工况','循环公交','交互功率','状态估计模型','混联输电','低温季节','高峰对话','退出机制','启动方法','实例评价','电力技术','应用软件','非线性因素','大规模接入','模拟支架','人资模块','相关设备','最优选址','信息共享','挽回损失','规划边界','冷却塔','房顶平台','旋转运动','实际问题','光传送网','工频变化量','最优站址','动态接触角','全局寻优能力','写作方法','输电通道','功率限制单元','系数β','能源冲击','货币政策目标','智能控制器','相关问题','光储系统','自动检测方法','正常运行特性','直接测量','金融腐败','精确可靠度','治学态度','计算过程','斜面机构','应用效果','正交试验','驱动电机','日内来水','材料损失过程','生产要素','长期超载','谐振抑制','绝缘拉杆','十四五','有限元剖分','实际规划','第二限位板','绝缘介质','力传感器','网站固定成本','和控制理论','预警系统','2倍频','溶胀速率','细颗粒物','系统管理','全球关注','盲数理论','总噪声','预防措施','大型企业集团','催化剂','气负荷','主网联络线','麦克斯韦方程','和处理','带电测试','蒙特卡罗模拟','夹持组件','燃煤机组','导线选型','能源需求','财产损失','安全系数','聚类同步','智能算法','配电网扩展','多库问题','重点领域改革','市场平台观','安全认证','智能电网框架','冲击负荷','实时检测','新能源开发','二氧化碳','无源控制电流','通信容量','审计成本','传输能力','ATT试验','非关键变量','柔性直流','交流电力系统','不均匀沉降','金融服务','环氧缺陷','智能系统','平价上网','云理论','房地产价格','细级缺陷','信号采集装置','锅炉汽温','负荷节点量测','会议日程','解释结构模型','流体运移','金属垫片','运行松弛度','闭环校验','稳态误差','动手能力','评估报告','穆斯林民族','跨区域','高压IGBT','外送通道','不匹配','极限短路比','故障原因','过/欠频','量化计算','共享性','公共数据云','备用调节电源','继保测试仪','线性拟合','傅里叶分析','过渡电阻','电磁模型','时序优化','变压器油','三支柱绝缘子','运行约束条件','年度培训计划','冲击装置','场景法','电改九号文','双层优化','阻抗模型','互联网用户','脉冲电流法','数据传递','元素分析','编码器','对应措施','移动组件','负荷节点','湖北宜昌','第二事理图谱','分类方法'],
            randomTags: [],
            loading: false,
            tagArr: ["企业战略", "能源互联网", "电力交易", "产业研究"],
            colorLists: ['#37B0BB', '#a4dcc3', '#03ffd1', '#54f8fe', '#FE545D', '#37B0BB', '#CBEAE4'],
            showFirst: true,
            showTwo: false,
            showThree: false,
            selectedType: "0",
            currentPage: 1,
            searchObj: {
                current: 1,
                pageNo: 1,
                pageSize: 10
            },
            fruitData: {},
            isHaveFirstData: false,
            isHaveTwoData: false,
            isHaveThreeData: false,
            searchMainObj:{
                current: 1,
                pageNo: 1,
                pageSize: 10,
                searchType: 0,
                addFieldFlag: true
            },
            searchFirstObj:{
                current: 1,
                pageNo: 1,
                pageSize: 10,
                searchType: 0,
                addFieldFlag: true
            },
            searchSecObj:{
                offset: 1
            },
            searchThiObj:{
                offset: 1
            },
            hotResultData: [],
            hyResultData: [],
            lwResultData: [],
            gotFruitIdList: [],
            showTop: false,
            firRadioValue: "",
            secRadioValue: "",
            fieldsArr: [{"name": "碳达峰碳中和研究", value: 1}, {"name": "新型电力系统研究", value: 2},{"name": "能源电力战略规划研究", value: 3},
                {"name": "能源电力供需研究", value: 4},{"name": "能源电力体制改革与电力市场研究", value: 5},{"name": "能源电力数字经济研究", value: 6},
                {"name": "企业战略规划研究", value: 7},{"name": "企业经营与财务研究", value: 8},{"name": "企业运营管理研究", value: 9},
                {"name": "企业治理与风控合规研究", value: 10},{"name": "品牌文化与社会责任研究", value: 11},{"name": "数据、模型工具及实验室", value: 12}],
            searchFirTopObj:{
                pageSize: 20
            },
            searchSecTopObj:{
                pageSize: 20
            },
            showTopFirstLoading: false,
            showTopTwoLoading: false,
            topFirData: [],
            topSecData: []

        }
    },
    computed: {},
    created(){
        this.cardHeight = (document.documentElement.clientHeight || document.body.clientHeight);

      let parentMsgData = JSON.parse(window.localStorage.getItem('parentMsgData'))
      console.log("----window.localStorage.getItem('parentMsgData')---" + parentMsgData);
      // let parentMsgData = {"researchDirection":"[{\"ftype\":\"主\",\"pro_direction_id\":\"35\",\"pro_direction\":\"能源电力数字化发展\",\"dtype\":\"主\",\"pro_field\":\"能源电力数字经济研究\",\"person_id\":\"1682\",\"pro_field_id\":\"6\"}," +
      //       "{\"ftype\":\"辅\",\"pro_direction_id\":\"44\",\"pro_direction\":\"公司财务管理\",\"dtype\":\"辅\",\"pro_field\":\"企业经营与财务研究\",\"person_id\":\"1682\",\"pro_field_id\":\"8\"}]"};
      if(parentMsgData && parentMsgData.researchDirection){
       let researchFields = JSON.parse(parentMsgData.researchDirection);
        console.log("---parentMsgData.researchDirection---"+ JSON.stringify(researchFields));
        window.localStorage.setItem("researchFields", JSON.stringify(researchFields.map(item => item.pro_field)));

        let researchDirs = [];
        let researchFies = [];
        researchFields.forEach(direction => {
          // if(direction.ftype == '主'){
            researchDirs.push(direction.pro_direction);
          // }
          // if(direction.dtype == '辅'){
            researchFies.push(direction.pro_field);
          // }
        });
        let result = [];
        if (researchFies.length > 5) {
          // 如果超过5个，只显示前5个主领域
          result = researchFies.slice(0, 5);
        }
        let mergedArray = [...researchDirs, ...researchFies];
        if(researchFies.length + researchDirs.length > 5) {
          result = mergedArray.slice(0, 5);
        }else{
          result = mergedArray;
        }
        // window.localStorage.setItem("researchDirAndFields", JSON.stringify(result))

        // this.randomTags = result;

      }
      this.getData();
    },
    methods: {
        handleChange(value) {
            console.log(`selected ${value}`);
            this.selectedType = value;
        },
        getFruitTag(){
          // this.randomTags = JSON.parse(window.localStorage.getItem("researchDirAndFields"));
            let url = "/ndTalent/fruit/getFruitTagByField";
            postAction(url, this.searchMainObj).then(res => {
                if (res.data.success) {
                    this.randomTags = res.data.result;
                }
            }).catch(err => {
                console.log(err)
            })
        },
        getData(){
            /*let url = "/ndTalent/fruit/getMostOfNumForFieldData";
            this.isHaveFirstData = false;
            this.isHaveTwoData = false;
            this.isHaveThreeData = false;
            postAction(url, this.searchMainObj).then(res => {
              if (res.data.success) {
                this.isHaveFirstData = true;
                this.isHaveTwoData = true;
                this.isHaveThreeData = true;

                this.hotResultData = res.data.result.hotResult;
                this.hyResultData = res.data.result.hyResult;
                this.lwResultData = res.data.result.lwResult;
                // res.data.result.hyResult.forEach(result => {
                //   let arr = result.resultModelList.map((item) => {return item.id});
                //   this.gotFruitIdList = [...this.gotFruitIdList, ...arr];
                // })
                // console.log("11" + this.gotFruitIdList)
                // res.data.result.lwResult.forEach(result => {
                //   let arr = result.resultModelList.map((item) => {return item.id});
                //   this.gotFruitIdList = [...this.gotFruitIdList, ...arr];
                // })
                // console.log(this.gotFruitIdList)
              }
            }).catch(err => {
              console.log(err)
            })*/
            this.getFruitTag();
            this.getHotResult();
            this.getFieldLinkFruit();
        },
        getHotResult(){
            let url = "/ndTalent/fruit/getHotFruit";
            this.isHaveFirstData = false;
            postAction(url, this.searchMainObj).then(res => {
                if (res.data.success) {
                    this.isHaveFirstData = true;
                    this.hotResultData = res.data.result.records;
                }
            }).catch(err => {
                console.log(err)
            })
        },
        getFieldLinkFruit(){
            let url = "/ndTalent/fruit/getFieldLinkFruit";
            this.isHaveTwoData = false;
            postAction(url, this.searchFirstObj).then(res => {
                if (res.data.success) {
                    this.isHaveTwoData = true;
                    this.hyResultData = res.data.result.records;
                }
            }).catch(err => {
                console.log(err)
            })

        },
        randomFruit(type){
            if(type == 1){
                this.searchMainObj.pageNo = this.searchMainObj.pageNo + 1;
                this.getHotResult();
            }else if(type == 2){
                this.searchFirstObj.pageNo = this.searchFirstObj.pageNo + 1;
                this.getFieldLinkFruit();
            }
        },
        search(value) {
            this.searchObj.content = value;
            if(!value){
                this.$message.error('请输入内容!')
                return false;
            }
            this.loading = true;

            this.loading = false;
            this.searchObj.searchType = this.selectedType;
            this.showDiv(false, true, false);
            this.$nextTick(()=>{
                this.$refs.childTalentFruit.toSearch(this.searchObj);
            })
        },
        showDiv(firstFlag, twoFlag, threeFlag){
            this.showFirst = firstFlag;
            this.showTwo = twoFlag;
            this.showThree = threeFlag;
            // if(twoFlag){
            //   this.$nextTick(()=>{
            //     this.$refs.childTalentFruit.toSearch(this.searchObj);
            //   })
            // }
        },
        changeObj(stype, scontent){
            this.searchObj.searchType = stype;
            this.searchObj.content = scontent;
        },
        toTalentInfo(authorId, authorName){
            this.$nextTick(()=>{
                this.$refs.childTalentInfo.showInfo(authorId, authorName);
            })
        },
        showFruitInfo(item){
            this.$nextTick(()=>{
                this.$refs.fruitInfo.showModalInfo(item);
            })
        },
        toShowTop(){
            this.showTop = !this.showTop;
            if(this.showTop){
                this.showTopFirstLoading = true;
                this.showTopTwoLoading = true;
                this.searchFirTopObj = {
                    pageSize: 20
                };
                this.searchSecTopObj = {
                    pageSize: 20
                };
                this.getTopFirData();
                this.getTopSecData();
            }
        },
        getTopFirData(){
            let url = "/ndTalent/talents/getTalentInfoDataOfCooNum";
            this.showTopFirstLoading = false;
            postAction(url, this.searchFirTopObj).then(res => {
                if (res.data.success) {
                    this.showTopFirstLoading = true;
                    this.topFirData = res.data.result;
                }
            }).catch(err => {
                console.log(err)
            })
        },
        getTopSecData(){
            let url = "/ndTalent/talents/getTalentInfoDataOfFruitNum";
            this.showTopTwoLoading = false;
            postAction(url, this.searchSecTopObj).then(res => {
                if (res.data.success) {
                    this.showTopTwoLoading = true;
                    this.topSecData = res.data.result;
                }
            }).catch(err => {
                console.log(err)
            })

        },
        onFirChange(value) {
            this.searchFirTopObj.field = "";
            if(this.firRadioValue == 1){
                this.searchFirTopObj.fruitType = 6;
                this.getTopFirData();
            }else if(this.firRadioValue == 2){
                this.searchFirTopObj.fruitType = 11
                this.getTopFirData();
            }
        },
        onSecChange(value) {
            this.searchSecTopObj.field = "";
            if(this.secRadioValue == 1){
                this.searchSecTopObj.fruitType = 6;
                this.getTopSecData();
            }else if(this.secRadioValue == 2){
                this.searchSecTopObj.fruitType = 11;
                this.getTopSecData();
            }
        },
        changeCooNumFiled(value) {
            this.searchFirTopObj.field = value;
            this.getTopFirData();
        },
        changFruitNumFiled(value) {
            this.searchSecTopObj.field = value;
            this.getTopSecData();
        },
        changeFirPageSize(value) {
            this.searchFirTopObj.pageSize = value;
            this.getTopFirData();
        },
        changeSecPageSize(value) {
            this.searchSecTopObj.pageSize = value;
            this.getTopSecData();
        },
    }
}
</script>

<style>
    ::-webkit-scrollbar{
        height:8px;
        width:8px;
    }
    ::-webkit-scrollbar-thumb{
        border-radius: 6px;
        background-color: rgb(121, 171, 177);
    }
    ::-webkit-scrollbar-thumb:hover{
        background-color: rgba(0, 128, 128, 1);
    }
    ::-webkit-scrollbar-track{
        background-color:transparent;
        padding:2px;
    }
</style>

<style scoped>

/deep/ .searchIpt .ant-input-group .ant-input{
    height: 50px !important;
    line-height: 50px !important;
}
/deep/ .searchIpt .ant-input-group .ant-input-group-addon{
    border-radius: 50px 0 0 50px !important;
}
/deep/ .searchIpt .ant-input-group .ant-input{
    border-radius:  0 50px 50px 0 !important;
}
/deep/ .searchIpt .ant-input-group .ant-input-affix-wrapper{
    font-size: 20px;
}
/deep/ .searchIpt .ant-input-affix-wrapper .ant-input{
  border-radius: 50px;
  height: 50px !important;
  padding-left: 20px;
}
/deep/ .searchIpt .ant-input-search-icon{
  font-size: 25px;
}
.sit{
    line-height: 80px;
    color: rgba(3, 129, 129, 1);
    font-size: 40px;
    text-align: center;
}
.searchIpt {
    height: 130px;
    width: 800px;
    margin: auto;
}
.cardcommon{
    line-height: 20px;
    border-radius: 20px;
    font-size: 14px;
    text-align: center;
}
.first{
    background: linear-gradient(134.48deg, rgba(239,250,251,1) 0.4%,rgba(182,217,206,0.8) 100.41%);
    color: rgba(16, 16, 16, 1);
    border: 1px solid rgba(0, 128, 128, 1);
}
.two{
    background: linear-gradient(135deg, rgba(255,207,195,0.27) 1.37%,rgba(251,127,93,0.43) 100.45%);
    color: rgba(251, 127, 93, 1);
    border: 1px solid rgba(251, 127, 93, 1);
}
.three{
    background: linear-gradient(134.77deg, rgba(96,129,245,0.13) -0.15%,rgba(96,129,245,0.59) 99.95%);
    color: rgba(96, 129, 245, 1);
    border: 1px solid rgba(96, 129, 245, 1);
}
.dott_f{
    font-size: 75px;
    color: rgba(0, 128, 128, 1);
}
.dott_s{
    font-size: 75px;
    color: rgba(251, 127, 93, 1);
}
.dott_t{
    font-size: 75px;
    color: rgba(96, 129, 245, 1);
}
.leftTit{
    height: 35px;
    font-size: 24px;
    text-align: center;
    line-height: 35px;
    font-weight: bold;
}
.centt{
    text-align: left;
}
.centerTit{
    height: 20px;
    opacity: 0.3;
    color: rgba(16, 16, 16, 1);
    font-size: 15px;
    text-align: left;
    padding-left: 10px;
}
.rightTit{
    font-size: 18px;
    line-height: 35px;
    font-weight: bold;
    cursor: pointer;
    text-align: right;
}
.dottc{
    font-size: 35px;
    line-height: 35px;
}
.autn{
    font-size: 18px;
    text-align: left;
    height: 35px;
    line-height: 35px;
}
.contc_firt{
    background-color: rgba(84, 211, 170, 0.38);
    border: 1px solid rgba(0, 128, 128, 1);
}
.contc_sec{
    background-color: rgba(255, 207, 195, 1);
    border: 1px solid rgba(251, 127, 93, 1);
}
.contc_thr{
    background-color: rgba(195, 207, 252, 1);
    border: 1px solid rgba(96, 129, 245, 1);
}
.cont_comm{
    line-height: 20px;
    border-radius: 10px;
    color: rgba(16, 16, 16, 1);
    font-size: 14px;
    text-align: center;
    margin: 10px;
}
.spin-content_fir {
    border: 1px solid #91d5ff;
    background-color: #e6f7ff;
    padding: 30px;
}
.spin-content_sec {
    border: 1px solid rgba(251, 127, 93, 1);
    background-color: rgba(251, 127, 93, 1);
    padding: 30px;
}
.spin-content_thr {
    border: 1px solid rgba(96, 129, 245, 1);
    background-color: rgba(96, 129, 245, 1);
    padding: 30px;
}

.colHead{
    font-size: 16px;
    padding: 5px;
    background-color: rgb(121, 171, 177);
    color: #fff;
}

.colCont{
    font-size: 16px;
    padding-top: 5px;
    height: 25px;
}

</style>